<!DOCTYPE html>
<html lang="zh-cn" xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>航空票务查询及订票系统 - 修改个人信息</title>

    <!-- Custom fonts for this template-->
    <link th:href="@{/vendor/fontawesome-free/css/all.min.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/google-font.css}" rel="stylesheet">

    <!-- Custom styles for this template-->
    <link th:href="@{/css/sb-admin-2.min.css}" rel="stylesheet">
</head>

<body class="bg-gradient-primary">

<div class="container">

    <div class="card o-hidden border-0 shadow-lg my-5">
        <div class="card-body p-0">
            <!-- Nested Row within Card Body -->
            <div class="row">
                <div class="col-lg-5 d-none d-lg-block bg-register-image"></div>
                <div class="col-lg-7">
                    <div class="p-5">
                        <div class="text-center">
                            <h1 class="h4 text-gray-900 mb-4">修改个人信息<small class="h6 text-sm-right text-danger" th:text="${msg}"></small></h1>
                        </div>
                        <form class="user" th:action="@{/user/update}" method="post">
                            <div class="form-group row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                    <input name="userID" th:value="${customer.user.userID}" type="text" class="form-control form-control-user" placeholder="请输入账号ID..." readonly="readonly">
                                </div>
                                <div class="col-sm-6">
                                    <input name="userName" th:value="${customer.user.userName}" type="text" class="form-control form-control-user" placeholder="姓名" required>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                    <input name="cellphoneNumber" th:value="${customer.cellphoneNumber}" type="text" class="form-control form-control-user" placeholder="手机号码" required>
                                </div>
                                <div class="col-sm-6">
                                    <input name="customerID" th:value="${customer.customerID}" type="text" class="form-control form-control-user" placeholder="身份证号码" readonly="readonly">
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                    <input name="email" th:value="${customer.email}" type="email" class="form-control form-control-user" placeholder="邮箱" required>
                                </div>
                                <div class="col-sm-6">
                                    <input name="birthDate" th:value="${#dates.format(customer.birthDate,'yyyy-MM-dd')}" type="date" class="form-control form-control-user" placeholder="出生日期" required>
                                </div>
                            </div>
                            <div class="form-group row">
                                <div class="col-sm-6 mb-3 mb-sm-0">
                                    <input type="password" th:value="${customer.user.userPassword}" class="form-control form-control-user" id="newPwd" placeholder="密码" oninput="validityPwd()" required>
                                </div>
                                <div class="col-sm-6">
                                    <input name="userPassword" th:value="${customer.user.userPassword}" type="password" class="form-control form-control-user" id="newPwdConfirm" oninput="validityPwd()" placeholder="确认密码" required>
                                </div>
                            </div>
                            <button type="submit" class="btn btn-primary btn-user btn-block">修改帐户</button>

                        </form>
                        <hr>
                        <div class="text-center">
                            <a th:href="@{/user/delete}" onClick="return confirm('确定删除?');" class="btn btn-danger btn-user btn-block">删除帐户</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    // 校验2个密码是否一致
    var validityPwd = function(){
        var newPwd = document.getElementById('newPwd');
        var newPwdConfirm = document.getElementById('newPwdConfirm');
        if(newPwd.value != newPwdConfirm.value){
            newPwdConfirm.setCustomValidity('两次密码输入不一致');
        }else{
            newPwdConfirm.setCustomValidity('');
        }
    }
</script>
<!-- Bootstrap core JavaScript-->
<script th:src="@{/vendor/jquery/jquery.min.js}"></script>
<script th:src="@{/vendor/bootstrap/js/bootstrap.bundle.min.js}"></script>

<!-- Core plugin JavaScript-->
<script th:src="@{/vendor/jquery-easing/jquery.easing.min.js}"></script>

<!-- Custom scripts for all pages-->
<script th:src="@{/js/sb-admin-2.min.js}"></script>

</body>

</html>
